// import { Select } from "antd"
import Form, { Rule } from "antd/es/form"
import { FC } from "react"

import { SFormItem } from "@/components/common"
import StyleSelect from "@/components/common/styleSelect"
import { useOptions } from "@/hooks/useOptions"
import { useLocale } from "@/locales"

// eslint-disable-next-line @typescript-eslint/no-unused-vars
export const RiskTypeSelector: FC<{
	rules?: Rule[] | undefined
	disable?: boolean | undefined
	labelProps?: typeof Form.Item
	selectorProps?: any
}> = props => {
	const { rules, disable, labelProps, selectorProps } = props
	const { formatMessage } = useLocale()
	const options = useOptions({ modal: "windLevelType", func: formatMessage })
	return (
		<SFormItem name="windControlType" label={formatMessage({ id: "label.risk_type" })} rules={rules} {...labelProps}>
			<StyleSelect
				placeholder={formatMessage({ id: "label.select_all" })}
				allowClear
				disabled={disable}
				options={options.map((item: FormConfig.ValueNLabel) => ({ ...item, value: Number(item.value) }))}
				{...selectorProps}
			/>
		</SFormItem>
	)
}
